<template>



  <div class="dashboard-editor-container">
    <!-- 第一块图标 -->
    <panel-group/>






    <el-row :gutter="30" style="margin-bottom: 30px;">
      <!-- 快捷入口 -->
      <el-col :span="16">
        <div style="width: 100%;padding: 30px;background-color: #fff; height: 450px;">
          <el-breadcrumb-item
            style=" margin-bottom: 5px; font-size: 22px; font-weight: bolder;border-bottom: 1px solid rgba(0, 0, 0, .12);width: 100%;padding-bottom: 20px;">
            快捷入口
          </el-breadcrumb-item>

          <quick-list />
        </div>
      </el-col>
      <!-- 待办事项 -->
      <el-col :span="8">
        <div style="width: 100%;padding: 30px;background-color: #fff;height: 450px;">
          <el-breadcrumb-item
            style=" margin-bottom: 5px; font-size: 22px; font-weight: bolder;border-bottom: 1px solid rgba(0, 0, 0, .12);width: 100%;padding-bottom: 20px;">
            代办事项
          </el-breadcrumb-item>
          <agent />
        </div>
      </el-col>
    </el-row>

    <!-- <el-row :gutter="30" style="margin-bottom: 30px;">
      <el-col :span="16">
        <div style="width: 100%;padding: 30px;background-color: #fff; height: 450px;">
          <el-breadcrumb-item
            style=" margin-bottom: 5px; font-size: 22px; font-weight: bolder;border-bottom: 1px solid rgba(0, 0, 0, .12);width: 100%;padding-bottom: 20px;">
            图表1
          </el-breadcrumb-item>
          <formal />
        </div>
      </el-col>
      <el-col :span="8">
        <div style="width: 100%;padding: 30px;background-color: #fff;height: 450px;">
          <el-breadcrumb-item
            style=" margin-bottom: 5px; font-size: 22px; font-weight: bolder;border-bottom: 1px solid rgba(0, 0, 0, .12);width: 100%;padding-bottom: 20px;">
            图表2
          </el-breadcrumb-item>
          <student-zu />

        </div>
      </el-col>
    </el-row> -->







    <!-- 新增模块结束 -->
    <!-- <el-row :gutter="30" style="margin-bottom: 30px;">
      <el-col :span="16">
        <div style="width: 100%;padding: 30px;background-color: #fff; height: 450px;">
          <el-breadcrumb-item
            style=" margin-bottom: 5px; font-size: 22px; font-weight: bolder;border-bottom: 1px solid rgba(0, 0, 0, .12);width: 100%;padding-bottom: 20px;">
            图表3
          </el-breadcrumb-item>
          <line-chart :chart-data="lineChartData" />
        </div>
      </el-col>
      <el-col :span="8">
        <div style="width: 100%;padding: 30px;background-color: #fff;height: 450px;">
          <el-breadcrumb-item
            style=" margin-bottom: 5px; font-size: 22px; font-weight: bolder;border-bottom: 1px solid rgba(0, 0, 0, .12);width: 100%;padding-bottom: 20px;">
            图表4
          </el-breadcrumb-item>
          <pie-chart  />

        </div>
      </el-col>
    </el-row> -->
    <!-- <el-row :gutter="30" style="margin-bottom: 30px;">
      <el-col :span="16">
        <div style="width: 100%;padding: 30px;background-color: #fff; height: 450px;">
          <el-breadcrumb-item
            style=" margin-bottom: 5px; font-size: 22px; font-weight: bolder;border-bottom: 1px solid rgba(0, 0, 0, .12);width: 100%;padding-bottom: 20px;">
            图表5
          </el-breadcrumb-item>
          <line-chart2  />
        </div>
      </el-col>
      <el-col :span="8">
        <div style="width: 100%;padding: 30px;background-color: #fff;height: 450px;">
          <el-breadcrumb-item
            style=" margin-bottom: 5px; font-size: 22px; font-weight: bolder;border-bottom: 1px solid rgba(0, 0, 0, .12);width: 100%;padding-bottom: 20px;">
            图表6
          </el-breadcrumb-item>
          <pie-chart2  style="width: 100%;" />
        </div>
      </el-col>
    </el-row> -->
    <!-- <el-row :gutter="30" style="margin-bottom: 30px;">
      <el-col :span="24">
        <div style="width: 100%;padding: 30px;background-color: #fff; height: 550px;">
          <el-breadcrumb-item
            style=" margin-bottom: 5px; font-size: 22px; font-weight: bolder;border-bottom: 1px solid rgba(0, 0, 0, .12);width: 100%;padding-bottom: 20px;">
            图表7
            <div style="float: right;z-index: 1;position: relative;">
              <el-select v-model="kcddj" placeholder="请选择时间" @change="getcont()">
                <el-option label="今天" value="0"></el-option>
                <el-option label="昨天" value="1"></el-option>
                <el-option label="近一周" value="2"></el-option>
                <el-option label="本月" value="3"></el-option>
              </el-select>
            </div>
          </el-breadcrumb-item>

          <bar-chart  />
        </div>
      </el-col>
    </el-row> -->


    <el-divider content-position="center" style='background-color: #000000;'>
      <a target="_blank" href="http://www.sdkuma.com">
        技术支持：动感小新
      </a>
    </el-divider>

  </div>
</template>

<script>

   import PanelGroup from './components/PanelGroup'
  import StudentZu from './components/StudentZu.vue'


  import LineChart from './components/LineChart'
  import LineChart2 from './components/LineChart2'

  import PieChart from './components/PieChart'
  import PieChart2 from './components/PieChart2'
  import BarChart from './components/BarChart'

  // 快捷入口模块
  import QuickList from './components/QuickList'
  // 代办事项模块
  import Agent from './components/Agent'
  // 正式学员人数变动模块
  import Formal from './components/Formal'
  // 人数模块
  import PeopleAll from './components/PeopleAll.vue'


  const lineChartData = {
    newVisitis: {
      expectedData: [100, 120, 161, 134, 105, 160, 165],
      actualData: [120, 82, 91, 154, 162, 140, 145]
    },
    messages: {
      expectedData: [200, 192, 120, 144, 160, 130, 140],
      actualData: [180, 160, 151, 106, 145, 150, 130]
    },
    purchases: {
      expectedData: [80, 100, 121, 104, 105, 90, 100],
      actualData: [120, 90, 100, 138, 142, 130, 130]
    },
    shoppings: {
      expectedData: [130, 140, 141, 142, 145, 150, 160],
      actualData: [120, 82, 91, 154, 162, 140, 130]
    }
  }

  export default {
    name: 'DashboardAdmin',
    components: {
      PanelGroup,
      LineChart,
      LineChart2,
      PieChart,
      BarChart,
      PieChart2,
      QuickList,
      Agent,
      Formal,
      PeopleAll,
      StudentZu
    },
    data() {
      return {

        loding: false,
        userinfo:localStorage.getItem("userInfo")
      }
    },
    methods: {

    },
    created() {


    }
  }
</script>

<style lang="scss" scoped>
  .dashboard-editor-container {
    padding: 32px;
    background-color: rgb(240, 242, 245);
    position: relative;

    .github-corner {
      position: absolute;
      top: 0px;
      border: 0;
      right: 0;
    }

    .chart-wrapper {
      background: #fff;
      padding: 16px 16px 0;
      margin-bottom: 32px;
    }
  }

  @media (max-width:1024px) {
    .chart-wrapper {
      padding: 8px;
    }
  }

  .for {
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
    margin-right: 0px;
  }

  .el-divider__text {
    background-color: rgba(0, 0, 0, 0);
    margin: 0 10px;
    color: #8e8e8e;
  }

  .el-dropdown-link {
    cursor: pointer;
    color: #409EFF;
  }

  .el-icon-arrow-down {
    font-size: 12px;
  }
</style>
